<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="">001</form>
    <form action="">002</form>
    <form action="">003</form>
    <form action="">004</form>
    <div class="demo">
        <a href="">link_01</a>
        <a href="">link_02</a>
        <a href="">link_03</a>
        <a href="">link_04</a>
    </div>
    <div class="demo">
        <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/7290b681343512c60e3a845379f3335f.jpg?thumb=1&w=250&h=250&f=webp&q=90" alt="">
        <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/7290b681343512c60e3a845379f3335f.jpg?thumb=1&w=250&h=250&f=webp&q=90" alt="">
        <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/7290b681343512c60e3a845379f3335f.jpg?thumb=1&w=250&h=250&f=webp&q=90" alt="">
        <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/7290b681343512c60e3a845379f3335f.jpg?thumb=1&w=250&h=250&f=webp&q=90" alt="">
    </div>

</body>
<script>
    // document  => window.document
    // 每个载入浏览器的 HTML 文档都会成为 Document 对象。
    // Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问

    console.log(document);
    console.dir(document);  

    // document的相关属性和方法
    // document.all   // 提供对文档中所有 HTML 元素的访问 (页面中所有元素的集合  document.getElementsByTagName("*"))
    // forms           // 提供对文档中所有form元素的访问
    // images           // 提供对文档中所有image元素的访问
    // links           // 提供对文档中所有link元素的访问
    // URL 返回当前文档的 URL。 
    // bgColor属性：可以改变文档的颜色；（ document.bgColor="gray";）

    // !!!!!!!!!!!!!!!!!!!
    // document.documentElement    快捷获取 html
    // document.body               快捷获取 body
    // document.head               快捷获取 head
    // document.title              获取和设置网页标题中内容 


    // console.log(document.all);
    // console.log(document.getElementsByTagName("*"));
    // console.log(document.forms);
    // console.log(document.images);
    // console.log(document.links);

    // console.log(document.documentElement);
    // console.log(document.body);
    // console.log(document.head);
    // console.log(document.title);

    // console.log(document.URL);
    // document.bgColor = "red"


    // 方法
    // getElementById() 返回对拥有指定 id 的第一个对象的引用。 
    // getElementsByName() 返回带有指定名称的对象集合。 
    // getElementsByTagName() 返回带有指定标签名的对象集合。  
    // write() 向文档写 HTML 表达式 或 JavaScript 代码。


</script>
</html>